<template>
    <div>
        <!-- 轮播图 -->
        <swiper :lundotuList="lundotuList" :isfull="true"></swiper>
          
        <!-- 9宫格 到 6 宫格 的改造 -->
        <ul class="mui-table-view mui-grid-view mui-grid-9">
		    <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
                <router-link to="/home/newslist">
                    <!-- <iframe src="../../resource/SVG/location.svg"></iframe> -->
                    <img src="../../resource/images/location.png" alt="">
		            <div class="mui-media-body">新闻资讯</div>
                </router-link>
		    </li>
		    <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
                <router-link to="/home/photolist" >
                    <img src="../../resource/images/shared.png" alt="">
		            <div class="mui-media-body">图片分享</div>
                </router-link>
		    </li>
		    <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
                <router-link to="/home/goodslist" >
                    <img src="../../resource/images/dianshangfuwu.png" alt="">
		            <div class="mui-media-body">商品购买</div>
                </router-link>
		    </li>
		    <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
                <router-link to="">
                    <img src="../../resource/images/liuyan_1.png" alt="">
		             <div class="mui-media-body">留言反馈</div>
                </router-link>
		    </li>
		    <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
                <router-link to="">
                    <img src="../../resource/images/video.png" alt="">
		            <div class="mui-media-body">视频专区</div>
                </router-link>
		    </li>
		    <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
                <router-link to="">
                    <img src="../../resource/images/phone.png" alt="">
		            <div class="mui-media-body">联系我们</div>
                </router-link>
		    </li>

		</ul>
    </div>
    
</template>
<script>
import  { Toast } from 'mint-ui'
import swiper from '../../subcomponents/swiper.vue'
export default {
    data(){
        return {
            lundotuList: [] //保存轮播图的数据
        };
    },
    created(){
        this.getLunBoTu();
        
    },
    methods: {
        // getLunBoTu(){//获取轮播图数据的方法
        //     this.$http.get('http://vue.studyit.io/api/getlunbo').then(result => {
        //         console.log(result.body)
        //         if(result.body.status === 0){
        //             this.lundotuList = result.body.message;
        //         }
        //         else{
        //             Toast("加载轮播图失败...")
        //         }
        //     })
        // }
        getLunBoTu(){//获取轮播图数据的方法,datajson
            this.$http.get('/api/lunbo').then((resp)=>{
   	  		resp = resp.body
   	  		if(resp.errno == 0){
   	  			this.lundotuList = resp.data;
   	  		}
   	  	})
        }
    },
    components:{
        swiper
    }
}
</script>
<style lang="scss" scoped>
    
    .mui-grid-view.mui-grid-9{
        background-color: white;
        border: none;
        .mui-media-body{
            font-size: 12px;
        }
        img{
            width: 40px;
            height: 40px;
        }
    }
    .mui-grid-view.mui-grid-9 .mui-table-view-cell{
        border: none;
    }
</style>